<template>
    <div class="attention">
        <Change_header title="关注" />
        <div class="attentionList">
            <div class="content_item clearfix">
                <div class="head_icon">
                    <img src="../../images/mainTwo/attention/01.png" />
                </div>
                <div class="content_text">
                    <p class="content_user_name">loveliness官方</p>
                    <p class="content_detail">女 18-35岁 混合型型肌肤</p>
                </div>
                <div class="content_time">
                    <span class="attentioned">已关注</span>
                </div>
            </div>
            <div class="content_item clearfix">
                <div class="head_icon">
                    <img src="../../images/mainTwo/attention/02.png" />
                </div>
                <div class="content_text">
                    <p class="content_user_name">蕊儿</p>
                    <p class="content_detail">女 18-35岁</p>
                </div>
                <div class="content_time">
                   <span class="attentioned">已关注</span>
                </div>
            </div>
            <div class="content_item clearfix">
                <div class="head_icon">
                    <img src="../../images/mainTwo/attention/03.png" />
                </div>
                <div class="content_text">
                    <p class="content_user_name">蕊儿</p>
                    <p class="content_detail">女 18-35岁</p>
                </div>
                <div class="content_time">
                    <span class="attentioned">已关注</span>
                </div>
            </div>
            <div class="content_item clearfix">
                <div class="head_icon">
                    <img src="../../images/mainTwo/attention/04.png" />
                </div>
                <div class="content_text">
                    <p class="content_user_name">密萌</p>
                    <p class="content_detail">女 18岁</p>
                </div>
                <div class="content_time">
                    <span class="attentioned">已关注</span>
                </div>
            </div>
            <div class="content_item clearfix">
                <div class="head_icon">
                    <img src="../../images/mainTwo/attention/05.png" />
                </div>
                <div class="content_text">
                    <p class="content_user_name">丫丫</p>
                    <p class="content_detail">女 18-35岁 混合型型肌肤</p>
                </div>
                <div class="content_time">
                    <span class="attentioned">已关注</span>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import Change_header from "../../components/changeHeader"
export default {
    name: "attention",
    components: { Change_header }
}
</script>
<style lang="less" scoped>
.attentionList {
    padding-top: 150/75rem;
    .content_item {
        margin: 30/75rem 0;
        box-shadow: 0 -5px 15px #ccc;
        padding: 20/75rem 20/75rem;
        .head_icon {
            float: left;
            img {
                width: 100/75rem;
                height: 100/75rem;
            }
        }
        .content_text {
            .content_user_name {
                font-size: 30/75rem;
            }
            float: left;
            font-size: 26/75rem;
            margin-left: 55/75rem;
            p:last-child {
                margin-top: 20/75rem;
            }
        }
        .content_time {
            margin-top: 40/75rem;
            color: #ff406f;
            float: right;
            font-size: 22/75rem;
            .attentioned{
                display: block;
                text-align: center;
                width: 100/75rem;
                border: 2px solid #ff406f;
                padding: 5/75rem;
                border-radius: 30/75rem;
            }
        }
    }
}
</style>

